<template>
  <div style="margin-left: -27px;">
    <tinymce :ref="data.fieldCode" :tinymceName="data.fieldAliase" :tinymceCode="data.fieldCode" @change="change" ></tinymce>
  </div>
</template>
<script>
  import tinymce from '@/components/Tinymce/Tinymce.vue'
  export default {
    name: 'Tinymce',
    components: { tinymce },
    props: {
      form: {
        type: Object,
        required: true
      },
      data: {
        type: Object,
        required: true
      }
    },
    data () {
      return {
        labelCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 3
          }
        },
        wrapperCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 20
          }
        },
        errmsg: null
      }
    },
    watch: {
      errmsg: {
        handler (newVal, oldVal) {
          if (newVal) {
            this.$message.error(newVal)
          }
        }
      }
    },
    created () {

    },
    methods: {
       getFieldValue () {
         const content = this.$refs[this.data.fieldCode].getContent()
         this.init(content)
         return content
       },
       init (content) {
         const data = this.data
         const fieldAliase = data.fieldAliase
         if (data.isRequired) {
            if (!content) {
               this.errmsg = fieldAliase + '必填'
               throw new Error(fieldAliase + '必填!')
            }
         }
         if (data.maxlength) {
            if (content && content.length > data.maxlength) {
              this.errmsg = fieldAliase + '长度不能大于' + data.maxlength
              throw new Error(fieldAliase + '长度不能大于' + data.maxlength)
            }
         }
       },
       setFieldValue (value) {
         if (value) {
           this.$refs[this.data.fieldCode].setContent(value)
         }
       },
       fieldClear () {
         this.$refs[this.data.fieldCode].setContent('')
       },
       change (e) {
         this.errmsg = null
       }
    }
  }
</script>
